<template>
	<view>
		<view class="page flex-col">
			<view class="section_1 flex-row">
				<image class="image_1" referrerpolicy="no-referrer"
					src="https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNG21249fca05e0176f65198d6f32b706fe.png" />
				<view class="group_1 flex-col"></view>
				<view class="group_2 flex-col">
					<view class="image-wrapper_1 flex-col">
						<image class="thumbnail_1" referrerpolicy="no-referrer"
							src="https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNG6e2b6211437a11a8113e62224745157c.png" />
					</view>
				</view>
				<div class="group_3 flex-col"></div>
				<!-- #ifdef H5 || MP-WEIXIN -->
				<!-- <image class="label_1" referrerpolicy="no-referrer"
					src="https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNG2b3e044d8902ccd0f421aaf34f805743.png" /> -->
				<view class="group_6 flex-row">
				<!-- #endif -->
					<!-- #ifdef APP-PLUS -->
					<!-- <image class="label_1" referrerpolicy="no-referrer" style="top: 50px;"
						src="https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNG2b3e044d8902ccd0f421aaf34f805743.png" /> -->
					<view class="group_6 flex-row" style="margin-top: 41px;">
					<!-- #endif -->
						<image class="label_2" referrerpolicy="no-referrer" @tap="$wanlshop.back(1)"
							src="https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNGf065ecb05500b50ee4b3af7f3d295b17.png" />
						<text class="text_1">{{worker_type_name}}主页</text>
					</view>

				</view>

				<view class="section_3 flex-col">
					<view class="box_1 flex-col"></view>
					<view class="box_2 flex-col"></view>
					<view class="box_3 flex-row">
						<text class="text_2">他的案例</text>
						<view class="image-text_1 flex-row justify-between"
							@tap="$wanlshop.to(`/pages/user/integral/evaluateTwo?item=${JSON.stringify(homeObj)}`)">
							<text class="text-group_1">查看更多</text>
							<div class="group_7 flex-col">
								<image src="https://img.aibbyp.com/wechat/newImg/right.png" mode=""></image>
							</div>
						</view>
						<view class="block_1 block-font" v-if="homeObj.case_images.length==0">
							暂无介绍
						</view>
						<view class="block_1" v-else>
							<view class="anlie" v-for="(item,index) in homeObj.case_images" :key="index">
								<image :src="$wanlshop.oss(item)" mode=""></image>
							</view>
						</view>
					</view>
				</view>
				<view class="section_4 flex-col">
					<view class="section_5 flex-row">
						<view class="group_8 flex-col justify-between">
							<text class="text_3">{{homeObj.real_name}}</text>
							<view class="image-text_2 flex-row justify-between">
								<image class="thumbnail_4" referrerpolicy="no-referrer"
									src="https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNGede822071d266c4a88b78e5126704e18.png" />
								<text class="text-group_2">成都市</text>
							</view>
						</view>
						<view class="text-wrapper_2 flex-col">
							<text class="text_5">{{homeObj.work_name}}</text>
						</view>
						<view class="group_9 flex-row">
							<view class="image-text_3 flex-row justify-between">
								<image class="thumbnail_5" referrerpolicy="no-referrer"
									src="https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNG5be47e6198196d1fed6e11741aefc733.png" />
								<text class="text-group_3">关注</text>
							</view>
						</view>
					</view>
					<view class="list_1 flex-row">
						<view class="center-box">
							<view>{{homeObj.favorable_comment}}%</view>
							<view>好评率</view>
						</view>
						<view class="center-box">
							<view>{{homeObj.work_score}}</view>
							<view>信用分</view>
						</view>
						<view class="center-box">
							<view>{{homeObj.service_to_num}}w</view>
							<view>已服务客服</view>
						</view>
						<view class="center-box">
							<view>{{homeObj.experience_years}}</view>
							<view>经验年数</view>
						</view>
					</view>
					<image class="image_4" referrerpolicy="no-referrer" :src="$wanlshop.oss(homeObj.avatar)" />
					<view class="section_6 flex-col">
						<view class="box_4 flex-row">
							<text class="text_9">个人亮点</text>
							<text class="text_16" v-for="(item,index) in homeObj.tags" :key="index">{{item}}</text>
						</view>
						<view class="box_5 flex-row">
							<text class="text_17">服务内容</text>
							<view class="text-group_6 flex-col justify-between">
								<text class="text_18">沟通装修方案</text>
								<text class="text_19">全程跟踪服务</text>
							</view>
							<view class="group_10 flex-col">
								<text class="text_20">实地测量面积</text>
								<div class="group_11 flex-col"></div>
								<text class="text_21">把控装修进度</text>
								<div class="group_12 flex-col"></div>
							</view>
							<view class="group_13 flex-col">
								<text class="text_22">出具精细报价清单</text>
								<div class="group_14 flex-col"></div>
								<text class="text_23">保障装修质量</text>
								<div class="group_15 flex-col"></div>
							</view>
						</view>
						<text class="text_24">资质证书</text>
						<view class="zs">
							<view>
								<image :src="$wanlshop.oss(homeObj.prove_imgs[0])" mode=""></image>
							</view>
							<view>
								<image :src="$wanlshop.oss(homeObj.prove_imgs[1])" mode=""></image>
							</view>
							<view>
								<image :src="$wanlshop.oss(homeObj.prove_imgs[2])" mode=""></image>
							</view>
						</view>
					</view>
				</view>
				<view class="section_7 flex-col">
					<view class="text-wrapper_5 flex-row justify-between">
						<text class="text_25">客户评价</text>
					</view>
					<view class="block_1 block-font" v-if="homeObj.user_comments.length==0">
						暂无介绍
					</view>
					<view v-else>
						<view class="group_17 flex-col"
							@tap="$wanlshop.to(`/pages/user/integral/evaluate?item=${JSON.stringify(item)}`)"
							v-for="(item,i) in homeObj.user_comments" :key="i">
							<view class="box_6 flex-row justify-between">
								<image class="label_3" referrerpolicy="no-referrer" :src="$wanlshop.oss(item.avatar)" />
								<view class="text-wrapper_6 flex-col justify-between">
									<text class="text_27">{{item.name}}</text>
									<text class="text_28">{{item.create_time}}</text>
								</view>
							</view>
							<text class="text_29">
								{{item.remark}}
							</text>
							<view class="box_7 flex-row">
								<!-- <text class="text_30">毛坯</text>
						<div class="group_18 flex-col"></div> -->
								<text class="text_31">{{item.tags}}</text>
							</view>
							<view class="tu">
								<image v-for="(items,index) in item.images" :src="$wanlshop.oss(items)" mode=""></image>
							</view>
						</view>

					</view>
				</view>
				<view class="group_19 flex-col">
					<view class="section_8 flex-row justify-between">
						<view class="image-text_5 flex-col justify-between" @tap="contactNumber" v-if="false">
							<image class="label_4" referrerpolicy="no-referrer"
								src="https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNGaf36b88c0d85a6d95fcff2748306b47d.png" />
							<text class="text-group_8">电话咨询</text>
						</view>
						<view class="image-text_6 flex-col justify-between" v-if="false">
							<view class="section_9 flex-col">
								<view class="text-wrapper_7 flex-col">
									<text class="text_32">8</text>
								</view>
							</view>
							<text class="text-group_9">在线客服</text>
						</view>
						<view class="text-wrapper_8 flex-col u-flex-1 u-flex u-row-center" @click="go_order()">
							<text class="text_33">免费预约</text>
						</view>
					</view>
				</view>
			</view>
		</view>

</template>
<script>
	export default {
		data() {
			return {
				loopData0: [{
						lanhutext0: '好评率',
						specialSlot1: {
							lanhutext0: '99%'
						},
						slot1: 1
					},
					{
						lanhutext0: '信用分',
						specialSlot1: {
							lanhutext0: '100'
						},
						slot1: 1
					},
					{
						lanhutext0: '已服务客户',
						specialSlot2: {
							lanhutext0: '2.5w'
						},
						slot2: 2,
					},
					{
						lanhutext0: '经验年数',
						specialSlot2: {
							lanhutext0: '10'
						},
						slot2: 2,
					},
				],
				homeObj: [],
				userinfo: {},
				worker_type_name: "工长"
			};
		},
		onLoad(option) {
			// 等级1:用户，2:个人工匠。3:公司工匠，5:区域服务商 
			let data = JSON.parse(option.item)
			if (data.level == 1) {
				this.worker_type_name = "用户";
			} else if (data.level == 2) {
				this.worker_type_name = "个人工匠";
			} else if (data.level == 3) {
				this.worker_type_name = "公司工匠";
			} else if (data.level == 5) {
				this.worker_type_name = "区域服务商 ";
			}
			this.userinfo = data;
			this.worKinfo(data.user_id)
		},
		methods: {
			worKinfo(id) {
				console.log(id)
				this.$api.get({
					url: '/jmy/worker/info',
					data: {
						user_id: id
					},
					success: res => {
						console.log(res)
						this.homeObj = res
					}
				})
			},
			contactNumber() { //电话拨打
				uni.makePhoneCall({
					phoneNumber: '15817780365'
				});
			},
			go_order() {
				uni.navigateTo({
					url: '/pages/artison/worker/worker' + "?worker_id=" + this.userinfo.user_id,
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			}
		},
	};
</script>
<style>
	.page {
		background-color: rgba(245, 245, 245, 1);
		position: relative;
		width: 100vw;
		height: 100vh;
		overflow: scroll;
	}

	.section_1 {
		background-color: rgba(255, 70, 48, 1);
		border-radius: 0px 0px 10px 10px;
		position: relative;
		width: 100vw;
		height: 31.18vw;
	}

	.image_1 {
		width: 24.36vw;
		height: 24.36vw;
		margin: 2.3vw 0 0 8.46vw;
	}

	.zs {
		width: 100%;
		display: flex;
		height: auto;
	}

	.zs image {
		height: 18.47vw;
		width: 114px;
		margin: 17px 10px;
		border-radius: 10px;
	}

	.group_1 {
		background-color: rgba(255, 116, 106, 1);
		border-radius: 50%;
		width: 8.98vw;
		height: 2.06vw;
		margin: 17.43vw 0 0 7.94vw;
	}


	.group_2 {
		background-image: linear-gradient(142deg,
				rgba(255, 226, 213, 1) 8.571429%,
				rgba(255, 100, 28, 1) 100%);
		border-radius: 46px 46px 0px 0px;
		height: 14.62vw;
		width: 14.36vw;
		position: absolute;
		left: 91.03vw;
		top: 19.24vw;
	}

	.image-wrapper_1 {
		background-image: linear-gradient(157deg,
				rgba(253, 166, 126, 1) 0,
				rgba(255, 109, 42, 1) 100%);
		border-radius: 115px;
		height: 2.31vw;
		width: 17.95vw;
		margin: 6.92vw 0 0 -10.51vw;
	}

	.thumbnail_1 {
		width: 4.36vw;
		height: 3.59vw;
		margin: 0.25vw 0 0 9.74vw;
	}

	.tu {
		width: 100%;
		overflow-x: scroll;
		height: 110px;
	}

	.tu image {
		width: 114px;
		height: 100px;
		border-radius: 2px;
		margin: 6px;
	}

	.group_3 {
		position: absolute;
		left: 81.29vw;
		top: -3.58vw;
		width: 12.06vw;
		height: 43.08vw;
	}

	.label_1 {
		position: fixed;
		left: 89.49vw;
		top: 8px;
		width: 6.16vw;
		height: 6.16vw;
		z-index: 99;
	}

	.group_4 {
		position: absolute;
		left: 0;
		top: 0;
		width: 100vw;
		height: 12.31vw;
	}

	.image_3 {
		width: 8.47vw;
		height: 3.85vw;
		margin: 4.35vw 0 0 7.94vw;
	}

	.thumbnail_2 {
		width: 5.13vw;
		height: 3.59vw;
		margin: 4.61vw 0 0 62.05vw;
	}

	.thumbnail_3 {
		width: 4.11vw;
		height: 3.59vw;
		margin: 4.61vw 0 0 1.02vw;
	}

	.group_5 {
		height: 3.08vw;
		background: url(https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/5d92ca3b1d404b609c44294472200540_mergeImage.png) 100% no-repeat;
		background-size: 100% 100%;
		width: 6.42vw;
		margin: 4.87vw 3.84vw 0 1.02vw;
	}

	.section_2 {
		background-color: rgba(255, 255, 255, 1);
		border-radius: 1px;
		width: 4.88vw;
		height: 2.06vw;
		margin: 0.51vw 0 0 0.51vw;
	}

	.group_6 {
		position: fixed;
		left: 0;
		z-index: 1;
		top: 0;
		width: 100vw;
		height: 11.29vw;
		background: rgba(255, 70, 48, 1);
	}

	.label_2 {
		width: 6.67vw;
		height: 6.16vw;
		margin: 2.56vw 0 0 3.07vw;
	}

	.text_1 {
		width: 17.44vw;
		height: 6.42vw;
		overflow-wrap: break-word;
		color: rgba(255, 255, 255, 1);
		font-size: 4.35vw;
		font-family: Source Han Sans-Medium;
		font-weight: 500;
		text-align: left;
		white-space: nowrap;
		line-height: 6.42vw;
		margin: 2.56vw 41.53vw 0 31.28vw;
	}

	.section_3 {
		position: absolute;
		left: 0;
		top: 47.18vw;
		width: 100vw;
		height: auto;
	}

	.box_1 {
		position: absolute;
		left: 0;
		top: -46.92vw;
		width: 4.11vw;
		height: 291.29vw;
	}

	.box_2 {
		position: absolute;
		left: 95.9vw;
		top: -47.17vw;
		width: 4.11vw;
		height: 320vw;
	}

	.box_3 {
		background-color: rgba(255, 255, 255, 1);
		border-radius: 10px;
		position: absolute;
		left: 0;
		top: 80.52vw;
		width: 99.75vw;
		height: 42.57vw;
	}

	.text_2 {
		width: 15.39vw;
		height: 5.65vw;
		overflow-wrap: break-word;
		color: rgba(51, 51, 51, 1);
		font-size: 3.84vw;
		font-family: Source Han Sans-Medium;
		font-weight: 500;
		text-align: left;
		white-space: nowrap;
		line-height: 5.65vw;
		margin: 3.07vw 0 0 4.1vw;
	}

	.image-text_1 {
		width: 17.7vw;
		height: 5.13vw;
		margin: 3.58vw 3.84vw 0 58.71vw;
	}

	.block-font {
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 24px;
		color: rgba(153, 153, 153, 1);
		font-weight: 500;
	}

	.text-group_1 {
		width: 14.36vw;
		height: 5.13vw;
		overflow-wrap: break-word;
		color: rgba(153, 153, 153, 1);
		font-size: 3.58vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		white-space: nowrap;
		line-height: 5.13vw;
	}

	.group_7 {
		width: 4.54vw;
		height: 4.54vw;
		margin-top: 0.7vw;
	}

	.group_7 image {
		width: 3vw;
		height: 3vw;
	}

	.anlie {
		margin-right: 10px;
		width: 100px;
		height: 100px;
	}

	.anlie image {
		border-radius: 5px;
		width: 100px;
		height: 100px;
	}

	.block_1 {
		display: flex;
		height: 25.65vw;
		width: 93%;
		overflow: hidden;
		overflow-x: auto;
		white-space: nowrap;
		position: absolute;
		left: 4.11vw;
		top: 13.85vw;
	}

	.block_2 {
		width: 12.57vw;
		height: 6.42vw;
		margin: 5.64vw 0 0 16.15vw;
	}

	.section_4 {
		background-color: rgba(255, 255, 255, 1);
		border-radius: 10px;
		position: absolute;
		left: 0;
		top: 27.7vw;
		width: 100vw;
		height: 67.95vw;
	}

	.section_5 {
		width: 69.49vw;
		height: 11.8vw;
		margin: 2.05vw 0 0 26.15vw;
	}

	.group_8 {
		width: 13.85vw;
		height: 11.8vw;
	}

	.text_3 {
		width: 13.08vw;
		height: 6.42vw;
		overflow-wrap: break-word;
		color: rgba(61, 61, 61, 1);
		font-size: 4.35vw;
		font-family: Source Han Sans-Medium;
		font-weight: 500;
		text-align: left;
		white-space: nowrap;
		line-height: 6.42vw;
	}

	.image-text_2 {
		width: 13.85vw;
		height: 4.36vw;
		margin-top: 1.03vw;
	}

	.thumbnail_4 {
		width: 3.59vw;
		height: 3.59vw;
		margin-top: 0.77vw;
	}

	.text-group_2 {
		width: 9.24vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(102, 102, 102, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		white-space: nowrap;
		line-height: 4.36vw;
	}

	.text-wrapper_1 {
		height: 4.88vw;
		border: 1px solid rgba(255, 230, 203, 1);
		width: 11.29vw;
		margin: 0.76vw 0 0 2.3vw;
		border-radius: 26px;
	}

	.text_4 {
		width: auto;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(216, 111, 0, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
		margin: 0.25vw 0 0 2.56vw;
	}

	.text-wrapper_2 {
		height: 4.88vw;
		border-radius: 26px;
		border: 1px solid rgba(255, 212, 203, 1);
		width: auto;
		margin: 0.76vw 0 0 6.02vw;
		padding: 0 5px;
	}

	.text_5 {
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(216, 36, 0, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
		margin: 0.25vw 0 0 0.56vw;
	}

	.group_9 {
		border-radius: 38px;
		background-image: linear-gradient(333deg,
				rgba(255, 74, 51, 1) 0,
				rgba(255, 130, 72, 1) 100%);
		width: 15.9vw;
		height: 6.16vw;
	}

	.image-text_3 {
		width: 10.77vw;
		height: 5.13vw;
		margin: 0.51vw 0 0 2.56vw;
	}

	.thumbnail_5 {
		width: 2.57vw;
		height: 2.57vw;
		margin-top: 1.29vw;
	}

	.text-group_3 {
		width: 7.18vw;
		height: 5.13vw;
		overflow-wrap: break-word;
		color: rgba(255, 255, 255, 1);
		font-size: 3.58vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		white-space: nowrap;
		line-height: 5.13vw;
	}

	.list_1 {
		width: 100%;
		height: 20.57vw;
		justify-content: space-between;
		align-items: center;
	}

	.text-wrapper_3 {
		position: relative;
		width: 10.77vw;
		height: 12.57vw;
		margin-right: 7.44vw;
	}

	.text_6 {
		position: absolute;
		left: 0.26vw;
		top: 0;
		width: 10.52vw;
		height: 7.44vw;
		overflow-wrap: break-word;
		color: rgba(255, 71, 49, 1);
		font-size: 5.12vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 7.44vw;
	}

	.text_7 {
		position: absolute;
		left: 3.59vw;
		top: 0;
		width: 11.29vw;
		height: 7.44vw;
		overflow-wrap: break-word;
		color: rgba(255, 71, 49, 1);
		font-size: 5.12vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 7.44vw;
	}

	.text_8 {
		width: 17.95vw;
		height: 5.13vw;
		overflow-wrap: break-word;
		color: rgba(77, 77, 77, 1);
		font-size: 3.58vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		white-space: nowrap;
		line-height: 5.13vw;
		margin-top: 7.44vw;
	}

	.image_4 {
		position: absolute;
		left: 4.11vw;
		top: -3.58vw;
		width: 70px;
		height: 70px;
		border-radius: 50%;
	}

	.section_6 {
		background-color: rgba(255, 249, 244, 1);
		border-radius: 6px;
		position: absolute;
		left: 0;
		top: 34.11vw;
		width: 100vw;
		height: 63.85vw;
	}

	.box_4 {
		width: 84.11vw;
		height: 10.77vw;
		margin: 3.58vw 0 0 3.84vw;
	}

	.text_9 {
		width: 12.31vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(102, 102, 102, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
	}

	.text-group_4 {
		width: 12.31vw;
		height: 10.77vw;
		margin-left: 7.18vw;
	}

	.text_10 {
		width: 12.31vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(255, 132, 0, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
	}

	.text_11 {
		width: 12.31vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(255, 132, 0, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
		margin-top: 2.06vw;
	}

	.text-group_5 {
		width: 15.39vw;
		height: 10.77vw;
		margin-left: 4.11vw;
	}

	.text_12 {
		width: 15.39vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(255, 132, 0, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
	}

	.text_13 {
		width: 12.31vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(255, 132, 0, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
		margin-top: 2.06vw;
	}

	.text-wrapper_4 {
		width: 15.39vw;
		height: 10.77vw;
		margin-left: 1.03vw;
	}

	.text_14 {
		width: 12.31vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(255, 132, 0, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
		margin-left: 3.08vw;
	}

	.text_15 {
		width: 12.31vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(255, 132, 0, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
		margin-top: 2.06vw;
	}

	.text_16 {
		width: 12.31vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(255, 132, 0, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
		margin-left: 4.11vw;
	}

	.box_5 {
		width: 88.21vw;
		height: 11.8vw;
		margin: 5.12vw 0 0 4.1vw;
	}

	.text_17 {
		width: 12.31vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(102, 102, 102, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
	}

	.text-group_6 {
		width: 18.47vw;
		height: 11.8vw;
		margin-left: 7.18vw;
	}

	.text_18 {
		width: 18.47vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(51, 51, 51, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
	}

	.text_19 {
		width: 18.47vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(51, 51, 51, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
		margin-top: 3.08vw;
	}

	.group_10 {
		width: 20.26vw;
		height: 11.8vw;
		margin-left: 1.8vw;
	}

	.text_20 {
		width: 18.47vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(51, 51, 51, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
		margin-left: 1.8vw;
	}

	.group_11 {
		width: 2.83vw;
		height: 0.26vw;
		border: 1px solid rgba(153, 153, 153, 1);
		margin-top: -3.07vw;
	}

	.text_21 {
		width: 18.47vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(51, 51, 51, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
		margin: 5.89vw 0 0 1.79vw;
	}

	.group_12 {
		width: 2.83vw;
		height: 0.26vw;
		border: 1px solid rgba(153, 153, 153, 1);
		margin: -3.07vw 0 2.82vw 0;
	}

	.group_13 {
		width: 26.42vw;
		height: 11.8vw;
		margin-left: 1.8vw;
	}

	.text_22 {
		width: 24.62vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(51, 51, 51, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
		margin-left: 1.8vw;
	}

	.group_14 {
		width: 2.83vw;
		height: 0.26vw;
		border: 1px solid rgba(153, 153, 153, 1);
		margin-top: -3.07vw;
	}

	.text_23 {
		width: 18.47vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(51, 51, 51, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
		margin: 5.89vw 0 0 1.79vw;
	}

	.group_15 {
		width: 2.83vw;
		height: 0.26vw;
		border: 1px solid rgba(153, 153, 153, 1);
		margin: -3.07vw 0 2.82vw 0;
	}

	.text_24 {
		width: 12.31vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(102, 102, 102, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: right;
		white-space: nowrap;
		line-height: 4.36vw;
		margin: 1.53vw 0 0 4.1vw;
	}

	.image_5 {
		width: 91.8vw;
		height: 18.47vw;
		margin: 5.12vw 0 3.07vw 4.1vw;
	}

	.section_7 {
		background-color: rgba(255, 255, 255, 1);
		position: absolute;
		left: 0.26vw;
		top: 172.31vw;
		width: 99.75vw;
		height: 44vw;
		border-radius: 12px
	}

	.center-box {
		font-family: 思源黑体;
		font-size: 14px;
		width: 25%;
		text-align: center;
		font-feature-settings: "kern" on;
		color: #FF4731;
	}

	.text-wrapper_5 {
		width: 37.95vw;
		height: 5.65vw;
		margin: 3.07vw 0 0 3.84vw;
	}

	.text_25 {
		width: 15.39vw;
		height: 5.65vw;
		overflow-wrap: break-word;
		color: rgba(77, 77, 77, 1);
		font-size: 3.84vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		white-space: nowrap;
		line-height: 5.65vw;
	}

	.text_26 {
		width: 15.39vw;
		height: 5.65vw;
		overflow-wrap: break-word;
		color: rgba(255, 69, 48, 1);
		font-size: 3.84vw;
		font-family: Source Han Sans-Medium;
		font-weight: 500;
		text-align: left;
		white-space: nowrap;
		line-height: 5.65vw;
	}

	.group_16 {
		width: 10.26vw;
		height: 0.26vw;
		border: 3px solid rgba(255, 70, 48, 1);
		margin: 0.51vw 0 0 28.97vw;
	}

	.group_17 {
		width: 91.8vw;
		height: 73.34vw;
		justify-content: flex-center;
		margin: 4.61vw 0 0 3.84vw;
		border-bottom: 1px solid #F5F5F5;
	}

	.box_6 {
		width: 28.98vw;
		height: 10vw;
		margin: 3.07vw 0 0 0.25vw;
	}

	.label_3 {
		width: 8.98vw;
		height: 8.98vw;
		border-radius: 50%;
	}

	.text-wrapper_6 {
		width: 17.95vw;
		height: 10vw;
	}

	.text_27 {
		width: 17.95vw;
		height: 5.13vw;
		overflow-wrap: break-word;
		color: rgba(51, 51, 51, 1);
		font-size: 3.58vw;
		font-family: Source Han Sans-Medium;
		font-weight: 500;
		text-align: left;
		white-space: nowrap;
		line-height: 5.13vw;
	}

	.text_28 {
		width: 16.16vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(102, 102, 102, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		white-space: nowrap;
		line-height: 4.36vw;
		margin-top: 0.52vw;
	}

	.text_29 {
		width: 91.8vw;
		height: 20vw;
		overflow-wrap: break-word;
		color: rgba(61, 61, 61, 1);
		font-size: 3.58vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		line-height: 7.18vw;
		margin: 2.05vw 0 0 0.51vw;
	}

	.box_7 {
		width: 21.54vw;
		height: 4.36vw;
		margin: 2.05vw 0 0 0.51vw;
	}

	.text_30 {
		width: 6.16vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(128, 128, 128, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		white-space: nowrap;
		line-height: 4.36vw;
	}

	.group_18 {
		width: 2.57vw;
		height: 0.26vw;
		border: 1px solid rgba(178, 178, 178, 1);
		margin: 1.02vw 0 0 1.53vw;
	}

	.text_31 {
		width: 12.31vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(128, 128, 128, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		white-space: nowrap;
		line-height: 4.36vw;
		margin-left: -1.02vw;
	}

	.box_8 {
		width: 92.06vw;
		height: 25.65vw;
		background: url(https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNG9514048037bf046c2a94b773a73aa04a.png) 100% no-repeat;
		background-size: 100% 100%;
		margin: 3.07vw 0 3.07vw -0.25vw;
	}

	.image-text_4 {
		width: 6.93vw;
		height: 7.18vw;
		margin: 9.23vw 0 0 74.1vw;
	}

	.thumbnail_6 {
		width: 2.57vw;
		height: 2.57vw;
		margin-top: 2.83vw;
	}

	.text-group_7 {
		width: 3.34vw;
		height: 7.18vw;
		overflow-wrap: break-word;
		color: rgba(255, 255, 255, 1);
		font-size: 5.64vw;
		font-family: Source Han Sans-Medium;
		font-weight: 500;
		text-align: left;
		white-space: nowrap;
		line-height: 7.18vw;
	}

	.group_19 {
		background-color: rgba(250, 250, 250, 1);
		height: 13.54vw;
		width: 100vw;
		position: fixed;
		left: -0.25vw;
		bottom: 0;
	}

	.section_8 {
		width: 91.8vw;
		height: 11.29vw;
		margin: 0.76vw 0 0 4.1vw;
	}

	.image-text_5 {
		width: 11.29vw;
		height: 11.29vw;
	}

	.label_4 {
		width: 6.16vw;
		height: 6.16vw;
		margin-left: 2.57vw;
	}

	.text-group_8 {
		width: 11.29vw;
		height: 4.11vw;
		overflow-wrap: break-word;
		color: rgba(102, 102, 102, 1);
		font-size: 2.82vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		white-space: nowrap;
		line-height: 4.11vw;
		margin-top: 1.03vw;
	}

	.image-text_6 {
		width: 11.29vw;
		height: 11.29vw;
		margin-left: 7.18vw;
	}

	.section_9 {
		height: 6.16vw;
		background: url(https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNGa5b18e2a20342ba9147424ba1759439b.png) 100% no-repeat;
		background-size: 100% 100%;
		margin-left: 2.57vw;
		width: 6.16vw;
	}

	.text-wrapper_7 {
		background-color: rgba(255, 95, 95, 1);
		border-radius: 50%;
		height: 3.59vw;
		width: 3.59vw;
		margin: -0.51vw 0 0 4.61vw;
	}

	.text_32 {
		width: 1.8vw;
		height: 4.11vw;
		overflow-wrap: break-word;
		color: rgba(255, 255, 255, 1);
		font-size: 2.82vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		white-space: nowrap;
		line-height: 4.11vw;
		margin: -0.51vw 0 0 1.02vw;
	}

	.text-group_9 {
		width: 11.29vw;
		height: 4.11vw;
		overflow-wrap: break-word;
		color: rgba(102, 102, 102, 1);
		font-size: 2.82vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		white-space: nowrap;
		line-height: 4.11vw;
		margin-top: 1.03vw;
	}

	.text-wrapper_8 {
		border-radius: 20px;
		background-image: linear-gradient(340deg,
				rgba(255, 70, 48, 1) 0,
				rgba(255, 149, 114, 1) 100%);
		height: 11.29vw;
		
		width: 54.88vw;
	}

	.text_33 {
		color: rgba(255, 255, 255, 1);
		font-family: Source Han Sans-Bold;
		text-align: left;
		white-space: nowrap;
	}

	.section_10 {
		width: 35.9vw;
		height: 1.29vw;
		margin: 6.15vw 0 2.05vw 32.05vw;
	}

	.block_3 {
		background-color: rgba(0, 0, 0, 1);
		border-radius: 25px;
		width: 35.9vw;
		height: 1.29vw;
	}

	.group_20 {
		position: absolute;
		left: 3.85vw;
		top: 87.44vw;
		width: 91.8vw;
		height: 45.98vw;
	}

	.block_4 {
		width: 28.98vw;
		height: 10vw;
		margin: 3.07vw 0 0 0.25vw;
	}

	.label_5 {
		width: 8.98vw;
		height: 8.98vw;
	}

	.text-wrapper_9 {
		width: 17.95vw;
		height: 10vw;
	}

	.text_34 {
		width: 17.95vw;
		height: 5.13vw;
		overflow-wrap: break-word;
		color: rgba(51, 51, 51, 1);
		font-size: 3.58vw;
		font-family: Source Han Sans-Medium;
		font-weight: 500;
		text-align: left;
		white-space: nowrap;
		line-height: 5.13vw;
	}

	.text_35 {
		width: 16.16vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(102, 102, 102, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		white-space: nowrap;
		line-height: 4.36vw;
		margin-top: 0.52vw;
	}

	.text_36 {
		width: 91.8vw;
		height: 14.36vw;
		overflow-wrap: break-word;
		color: rgba(61, 61, 61, 1);
		font-size: 3.58vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		line-height: 7.18vw;
		margin: 2.05vw 0 0 0.51vw;
	}

	.block_5 {
		width: 27.7vw;
		height: 4.36vw;
		margin: 2.05vw 0 3.07vw 0.51vw;
	}

	.text_37 {
		width: 12.31vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(128, 128, 128, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		white-space: nowrap;
		line-height: 4.36vw;
	}

	.box_9 {
		width: 2.57vw;
		height: 0.26vw;
		border: 1px solid rgba(178, 178, 178, 1);
		margin: 1.02vw 0 0 1.53vw;
	}

	.text_38 {
		width: 12.31vw;
		height: 4.36vw;
		overflow-wrap: break-word;
		color: rgba(128, 128, 128, 1);
		font-size: 3.07vw;
		font-family: Source Han Sans-Regular;
		font-weight: normal;
		text-align: left;
		white-space: nowrap;
		line-height: 4.36vw;
		margin-left: -1.02vw;
	}

	body *,
	page view {
		box-sizing: border-box;
		flex-shrink: 0;
	}

	body {
		font-family: PingFangSC-Regular, Roboto, Helvetica Neue, Helvetica, Tahoma,
			Arial, PingFang SC-Light, Microsoft YaHei;
		margin: 0;
	}

	button {
		margin: 0;
		padding: 0;
		border: 1px solid transparent;
		outline: none;
		background-color: transparent;
	}

	button:active {
		opacity: 0.6;
	}

	.flex-col {
		display: flex;
		flex-direction: column;
	}

	.flex-row {
		display: flex;
		flex-direction: row;
	}

	.justify-start {
		display: flex;
		justify-content: flex-start;
	}

	.justify-center {
		display: flex;
		justify-content: center;
	}

	.justify-end {
		display: flex;
		justify-content: flex-end;
	}

	.justify-evenly {
		display: flex;
		justify-content: space-evenly;
	}

	.justify-around {
		display: flex;
		justify-content: space-around;
	}

	.justify-between {
		display: flex;
		justify-content: space-between;
	}

	.align-start {
		display: flex;
		align-items: flex-start;
	}

	.align-center {
		display: flex;
		align-items: center;
	}

	.align-end {
		display: flex;
		align-items: flex-end;
	}
</style>